// ===前台头部===

// 引入全站通用重置样式
@import '../../../common/less/reset.less';
// 邓元翔的模块封装库
@import '../../../common/less/deng_module.less';
// 常用方法库
@import '../../../common/less/function.less';


/* ===前台公共头部=== */
.g-hd{
    width: 100%;
}

.g-hd{
    .m-topnav .m-bd,.m-banner>a,.m-mn,.m-nav .m-bd{
        .block-center();
        width: 1210px;
    }
    
    /* ===导航=== */
    .m-topnav{
        @_h:30px;
        height: @_h;
        line-height: @_h;
        background: #f1f1f1;
        
        .m-bd{
            height: @_h;
            line-height: @_h;
            background-color: wheat;
        }
    }
    /* ===广告=== */
    .m-banner{
        background-color: #b50100;
        
        >a{.f-db;}
        img{
            border: 0;
            vertical-align: middle;
        }
    }
    /* ===logo，搜索=== */
// .m-mn{
//     background-color: wheat;
// }
   .m-logo{
       float: left;
       width: 362px;
       height: 60px;
       padding-top: 20px;
       padding-bottom: 20px;
   }
   .u-logo{
       .f-db;
       float: left;
       width: 270px;
       height: 60px;
       background-image: url(../../../common/img/logo-201305.png);
       background-repeat: no-repeat;
       text-indent: -2em;
       .f-oh;
   }
   
   .m-search{
       float: left;
       margin-top: 25px;
       
       input,button{.font-family("微软雅黑");}
       
       input{
           float: left;
            width: 446px;
            height: 24px;
            line-height: 24px;
            padding: 4px;
            border-width: 2px 0 2px 2px;
            border-color: #B61D1D;
            border-style: solid;
            font-size: 14px;
       }
       button{
           width: 82px;
           height: 36px;
           line-height: 1em;
           background: #B61D1D;
            border: none;
            color: #fff;
            font-size: 16px;
       }
   }
    /* 我的购物车 */
   .m-cart{
       position: relative;
       float: right;
       margin-top: 25px;
       margin-right: 65px;
       
       .z-ctr{
           border: 1px solid #ddd;
           .box-shadow(0 0 5px rgba(0,0,0,.2));
           background-color: #fff;
       }
       &:hover{
           .m-hd,.m-bd{.z-ctr;}
       }
       
       
       @_h:34px;
       .m-hd{
           position: relative;
            width: 75px;
            height: @_h;
            line-height: @_h;
            padding-left: 36px;
            padding-right: 28px;
            border: 1px solid #DFDFDF;
            text-align: center;
            background: #F9F9F9;
            
            a{
               color: #666;
               &:hover{
                   color: #C81623;
               }
           }
       }
       
       .u-cart,.u-arrows,.u-count{
           position: absolute;
           .f-oh;
       }
       .u-cart{
           top: 9px;
            left: 18px;
           width: 18px;
           height: 16px;
           background: url(../../common/img/jd2015img.png) 0 -58px no-repeat;
       }
       .u-count{
           top: -4px;
           left: 104px;
           min-width: 12px;
           line-height: 12px;
           padding: 1px 2px;
           border-radius: 7px 7px 7px 0;
           font-size: 12px;
           color: #fff;
           background-color: #c81623;
       }
       .u-arrows{
           top: 0;
           right: 10px;
           font-size: 13px;
           .font-family("宋体");
       }
       
       .m-bd{
           position: absolute;
           right: 0;
           width: 308px;
       }
       .m-nogoods{
           padding: 10px 15px;
           height: 49px;
            line-height: 49px;
            overflow: hidden;
            color: #999;
       }
   }
   
    /* 热门搜索 */
   .m-hotkey{
       @_h:20px;
       float: left;
       width: 518px;
       height: @_h;
       line-height: @_h;
       .f-oh;
       
       @_font_color:#c81623;
       a{
           margin-right: 10px;
           &:hover{color: @_font_color;}
       }
       .s-fc{color: @_font_color;}
   }
   
    /* 产品大分类 */
   @_nav_h:44px;
   .m-nav{
        height: @_nav_h;
        border-bottom: 2px solid #B1191A;
        
        .m-bd{
            height: @_nav_h;
            background-color: wheat;
        }
   }
    .m-cates{
        position: relative;
        float: left;
        width: 210px;
//          height: @_nav_h;
        
        @_item_h: 31px;
        .m-dt{
            .f-db;
            width: 190px;
            height: @_nav_h;
            line-height: @_nav_h;
            padding-left: 10px;
            padding-right: 10px;
            font-size: 15px;
            color: #fff;
            .font-family("微软雅黑");
            background: #B1191A;
        }
        .m-dd{
            width: 210px;
            height: 466px;
            background: #c81623;
            margin-top: 2px;
            
        }
        .m-menu {
            li{
                position: relative;
                height: @_item_h;
                border-left: 1px solid #b61d1d;
                color: #fff;
            }
            h3{
                height: @_item_h;
                line-height: @_item_h;
                padding-left: 10px;
                padding-right: 10px;
                font-size: 14px;
                font-weight: 400;
                .font-family("微软雅黑");
            }
            a{
                color: #fff;
            }
            i{
                position: absolute;
                top: 9px;
                right: 11px;
                font: 400 9px/14px consolas;
            }
            .z-active{
                @_font_color:#b61d1d;
                color: @_font_color;
                background: #f7f7f7;
                a{color: @_font_color;}
                i{
                    font-size: 0;
//                  top: 0;
//                  left: 205px;
//                  height: 31px;
//                  background-color: green;
                }
            }
        }
        /* 分类菜单的下拉模块 */
        .m-dorpdown{
            position: absolute;
            top: 45px;
            left: 209px;
            display: none;
            width: 999px;
            height: 465px;
            border: 1px solid #b61d1d;
            background: #f7f7f7;
            .f-oh;
            
            li{
                display: none;
            }
            
            &.z-active{display: block;}
            .z-active{display: block;}
        }
        /* 分类下拉内的频道 */
        .m-channels{
            float: left;
            display: inline;
            margin-left: 20px;
            margin-top: 20px;
            
            a{
                float: left;
                margin-right: 10px;
                padding-left: 8px;
                line-height: 24px;
                color: #fff;
                background: #7C7171;
            }
            i{
                .inline-block;
                margin-left: 8px;
                width: 23px;
                width: 24px;
                line-height: 24px;
                text-align: center;
                font-size: 9px;
                font-family: consolas;
                background: #5c5251;
                cursor: pointer;
            }
        }
        /* 品牌 */
        .m-brands{
            float: right;
            display: inline;
            width: 168px;
            margin-top: 19px;
            margin-right: 20px;
            margin-bottom: 10px;
            .f-oh;
            
            a{
                float: left;
                display: inline;
                margin-left: 1px;
                margin-top: 1px;
            }
            img{
                width: 83px;
                height: 35px;
                .f-vam;
            }
        }
        /* 促销 */
       .m-promotions{
           float: right;
            display: inline;
            width: 168px;
            margin-right: 20px;
       }
       
       .m-scates{
           float: left;
            width: 790px;
            padding: 6px 0 1006px 20px;
            background: #f7f7f7;
            min-height: 409px;
            
            dl{
                line-height: 2em;
                .f-oh;
            }
            dt{
                position: relative;
                float: left;
                width: 54px;
                padding-top: 8px;
                padding-right: 30px;
                text-align: right;
                font-weight: bold;
            }
            dd{
                float: left;
                display: inline;
                margin-top: 6px;
                margin-bottom: 6px;
                width: 620px;
                border-top: 1px solid #eee;
                
                a{
                    float: left;
                    display: inline;
                    margin-top: 4px;
                    margin-bottom: 4px;
                    padding-left: 8px;
                    padding-right: 8px;
                    height: 16px;
                    line-height: 16px;
                    border-left: 1px solid #e0e0e0;
                    white-space: nowrap;
                }
            }
            i{
                position: absolute;
                top: 13px;
                right: 18px;
                width: 4px;
                height: 14px;
                line-height: 14px;
                font-size: 9px;
                font-family: consolas;
            }
       }
       .m-cates-1 {
           dd{border-top: none;}
       }
    }
    
}